<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" layout:decorate="~{layout.html}" th:with="currentPage=#{label.signADigest}">
	<body>		
		<div layout:fragment="content">
			<div th:replace="~{fragment/disclaimer-mock-tsp :: mock-tsp-warn}"></div>
              
            <form id="digest-sign-form" method="post" th:action="@{/sign-a-digest}" th:object="${signatureDigestForm}">

                <input type="hidden" id="process" value="DIGEST_SIGN" />

                <div th:replace="~{fragment/fields :: field-signature-form}"></div>

                <div th:replace="~{fragment/fields :: field-digest-algo}"></div>

                <div th:replace="~{fragment/fields :: field-document-digest}"></div>

                <div th:replace="~{fragment/fields :: field-signature-level}"></div>

                <div th:replace="~{fragment/fields :: field-sign-expired}"></div>
                
                <div th:replace="~{fragment/fields :: field-content-timestamp}"></div>

                <div th:replace="~{fragment/nexu :: nexu-alert}"></div>

                <div class="form-group row">
                    <div class="offset-sm-3 col-sm-9">
                        <button type="submit" class="btn btn-primary" id="submit-button" th:text="#{label.submit}" disabled="disabled"></button>
                        <button id="btnClear" class="btn btn-secondary" th:text="#{label.clear}"></button>
                    </div>
                </div>

            </form>
        </div>
		<div layout:fragment="scripts">
            <script type="text/javascript" th:src="@{/scripts/jsDigestAlgorithm.js}"></script>
            <script type="text/javascript" th:src="@{/scripts/jsSignatureLevel.js}"></script>
            <script type="text/javascript" th:src="@{/scripts/jsDigestSign.js}"></script>
            <script type="text/javascript" th:src="@{/scripts/jsCryptoSupportAlert.js}"></script>
            <script type="text/javascript" th:src="@{/js/nexu-deploy.js}"></script>
			<script type="text/javascript">
				$('[data-toggle="tooltip"]').tooltip();
				
				$('#fileToCompute').change(function() {
					if (this.files != null && this.files.length == 1) {
						let file = this.files[0];
						$('#filename').text(file.name);
					} else {
						resetName();
					}
				});

				$('#btnClear').click(function(e) {
					e.preventDefault();
					form = e.toElement.form;
					form.reset();
					resetName();
				});

				function resetName() {
					$('#filename').text("[[#{label.compute.digest}]]");
				}
			</script>
	
		</div>
	</body>
</html>